<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>list</title>
    <link type="text/css" rel="stylesheet" href="../../dist/cute.css"/>
    <style type="text/css">
        .m8 {
            margin: 18px 288px;
        }
    </style>
    <script src="../sea-modules/seajs/seajs/sea.js" id="seajsnode"></script>
    <script src="../config.js"></script>
    <script>
        seajs.use(['$', 'jquery/tabs/tabs'], function($) {
            window.$ = $;
            $(function() {
                $('.tabs.click').tabs();

                $('.tabs.mouseover').tabs({
                    trigger: 'mouseover',
                    start: 2
                });
            });
        })
    </script>
</head>
<body class="m8">
<div class="tabs click">
    <ul class="tabs-nav">
        <li class="tabs-nav-active">tab1</li>
        <li>tab2</li>
        <li>tab3</li>
    </ul>
    <div class="tabs-panels">
        <div class="tabs-panel tabs-panel-active">
            tab1<br/>
            tab1<br/>
            tab1<br/>
        </div>
        <div class="tabs-panel">
            tab2<br/>
            tab2<br/>
            tab2<br/>
        </div>
        <div class="tabs-panel">
            tab3<br/>
            tab3<br/>
            tab3<br/>
        </div>
    </div>
</div>
<br/>
<div class="tabs click">
    <h2 class="tabs-nav">
        <span>tab1</span>
        <span class="tabs-nav-active">tab2</span>
        <span>tab3</span>
    </h2>
    <div class="tabs-panels">
        <div class="tabs-panel">
            tab1<br/>
            tab1<br/>
            tab1<br/>
        </div>
        <div class="tabs-panel tabs-panel-active">
            tab2<br/>
            tab2<br/>
            tab2<br/>
        </div>
        <div class="tabs-panel">
            tab3<br/>
            tab3<br/>
            tab3<br/>
        </div>
    </div>
</div>

<br/>
<div class="tabs mouseover">
    <h2 class="tabs-nav">
        <span>tab1</span>
        <span>tab2</span>
        <span>tab3</span>
    </h2>
    <div class="tabs-panels">
        <div class="tabs-panel">
            tab1<br/>
            tab1<br/>
            tab1<br/>
        </div>
        <div class="tabs-panel">
            tab2<br/>
            tab2<br/>
            tab2<br/>
        </div>
        <div class="tabs-panel">
            tab3<br/>
            tab3<br/>
            tab3<br/>
        </div>
    </div>
</div>
</body>
</html>

